(function (window, undefined) {
    class Game {
        constructor(tage, score) {
            this.ball = new Ball(tage)
            this.ward = new Ward(tage)
            this.brick = new Brick(tage)
            this.tage = tage
            this.stepX = 6
            this.stepY = 6
            this.score = score
        }
        start() {
            this.ball.renderBall()
            this.ward.renderWard()
            this.brick.renderBrickTage()
            this.moveWard()
            let timer = null
            document.onclick = function () {

                clearInterval(timer)

                timer = setInterval(function () {
                    this.isLaunch(timer)
                    this.moveball()
                    // clearInterval(timer)
                }.bind(this), 50)
            }.bind(this)
        }
        moveball() {
            this.ball.balls[0].style.bottom = (parseInt(this.ball.balls[0].style.bottom) + this.stepY) + "px"
            this.ball.balls[0].style.left = (parseInt(this.ball.balls[0].style.left) + this.stepX) + "px"

        }
        isLaunch(timer) {
            if (this.ball.balls[0].offsetLeft + this.ball.width > window.innerWidth) {
                this.stepX = -6
            } else if (this.ball.balls[0].offsetTop <= 0) {
                this.stepY = -6
            } else if (this.ball.balls[0].offsetTop >= this.tage.offsetHeight) {
                clearInterval(timer)
                this.ball.parent.children[0].style.display = "block"
            } else if (this.ball.balls[0].offsetLeft <= 0) {
                this.stepX = 6
            } else if (this.ball.balls[0].offsetTop + this.ball.height <= this.ward.balls[0].offsetTop + this.ward.balls[0].offsetHeight && this.ball.balls[0].offsetTop + this.ball.height >= this.ward.balls[0].offsetTop && this.ball.balls[0].offsetLeft + this.ball.balls[0].offsetWidth >= this.ward.balls[0].offsetLeft && this.ball.balls[0].offsetLeft <= this.ward.balls[0].offsetLeft + this.ward.balls[0].offsetWidth) {
                this.stepY = 6
            }

            for (let i = 0; i < this.brick.eles.length; i++) {

                if (this.ball.balls[0].offsetTop + this.ball.balls[0].offsetHeight >= this.brick.eles[i].offsetTop && this.ball.balls[0].offsetLeft + this.ball.balls[0].offsetWidth >= this.brick.eles[i].offsetLeft && this.ball.balls[0].offsetLeft <= this.brick.eles[i].offsetLeft + this.brick.eles[i].offsetWidth && this.ball.balls[0].offsetTop <= this.brick.eles[i].offsetTop + this.brick.eles[i].offsetHeight) {


                    if (this.ball.balls[0].offsetTop <= this.brick.eles[i].offsetTop + this.brick.eles[i].offsetHeight && this.ball.balls[0].offsetTop > this.brick.eles[i].offsetTop && this.stepY > 0 && this.ball.balls[0].offsetTop > this.brick.eles[i].offsetTop) {
                        this.stepY = -6
                    }

                    else if (this.ball.balls[0].offsetTop + this.ball.balls[0].offsetHeight >= this.brick.eles[i].offsetTop && this.stepY < 0 && this.ball.balls[0].offsetTop <= this.brick.eles[i].offsetTop) {
                        this.stepY = 6
                    }


                    this.brick.removeBrick(i)
                    this.addScore()
                }


            }
        }
        moveWard() {
            document.onmousemove = function (e) {
                this.ward.balls[0].style.left = e.clientX - parseInt(this.ward.balls[0].style.width) / 2 + "px"
            }.bind(this)
        }
        addScore() {
            let num = parseInt(this.score.innerText) + 1
            this.score.innerText = num
        }

    }

    window.Game = Game
})(window, undefined)